<!-- 福分兑换记录 -->
<template>
  <page-header-wrapper>
    <a-card class="table-card">
      <GzSearchForm :searchFunc="searchFunc" :resetFunc="onReset" searchConditionNum="6">
        <a-form-item label="" class="table-search-item">
          <a-select v-model:value="searchData['awardType']" placeholder="类型">
            <a-select-option value="">全部</a-select-option>
            <a-select-option :value="0">卡券</a-select-option>
            <a-select-option :value="1">实物奖品</a-select-option>
            <a-select-option :value="2">虚拟券</a-select-option>
          </a-select>
        </a-form-item>
      </GzSearchForm>

      <!-- 列表渲染 -->
      <GzTable
        ref="infoTableRef"
        :init-data="true"
        :req-table-data-func="reqTableDataFunc"
        :table-columns="tableColumns"
        :search-data="searchData"
      >
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'awardType'">
            <span v-if="record.awardType === 0">卡券</span>
            <span v-else-if="record.awardType === 1">实物奖品</span>
            <span v-else="record.awardType === 2">虚拟券</span>
          </template>
          <template v-if="column.key === 'operation'">
            <!-- 操作列插槽 -->
            <GzTableColumns>
              <!-- <a-button type="link" >详情</a-button> -->
              <a-button v-if="$access('ENT_SCORE_EXCHANGE_INFO_DEL')" type="link" danger>删除</a-button>
            </GzTableColumns>
          </template>
        </template>
      </GzTable>
    </a-card>
  </page-header-wrapper>
</template>
<script setup lang="ts">


import { ref, reactive, getCurrentInstance } from 'vue'
import { req, API_SCORE_EXCHANGE_RECORDS } from '@/api/manage'
import {$getExchangeList} from '@/api/score/scoreExchange/index'
const { $infoBox, $access } = getCurrentInstance()!.appContext.config.globalProperties

const infoTableRef = ref()
let tableColumns = reactive([
  { key: 'scoreExchangeId', title: '兑换的奖品ID',dataIndex: 'scoreExchangeId',fixed: 'left' },
  { key: 'name', title: '商品名称',dataIndex: 'name' },
  { key: 'scoreNeed', title: '所需的福分',dataIndex: 'scoreNeed' },
  { key: 'awardType', title: '类型',dataIndex: 'awardType' },
  // { key: 'operation', title: '操作', dataIndex: 'operation',  fixed: 'right', align: 'center' }
])

const searchData = ref({})

// 请求table接口数据
function reqTableDataFunc(params: any) {
  return $getExchangeList(params)

}

function onReset(){ // 重置搜索
  searchData.value = {}
}


function searchFunc() {
  console.log(searchData)
  infoTableRef.value.refTable(true)
}


</script>
